<template>
	<Layout class="p-5 bg-white">
		<Form class="p-5" :model="cardType" :label-width="150">
			<Row>
				<Col span="8">
				<FormItem class="w-100" label="会员卡名称">
					<Input v-model="cardType.name" />
				</FormItem>
				<FormItem class="w-100" label="有效时长/天">
					<Input @keyup.native="changeTimeLongs" v-model="cardType.timeLongs" />
				</FormItem>
				<FormItem @keyup.native="changeAmount" class="w-100" label="价格">
					<Input v-model="cardType.amount" />
				</FormItem>
				<FormItem class="w-100" label="会员卡状态">
					<Select :class="'w-100'" v-model="cardType.statu" placeholder="请选择会员卡状态" style="width:200px">
						<Option v-for="item in status" :value="item.value" :key="item.value">{{item.label}}</Option>
					</Select>
				</FormItem>
				</Col>
			</Row>
			<FormItem>
				<Button @click="submit" type="primary">提交</Button>
				<Button @click="cancel" style="margin-left: 8px">取消</Button>
			</FormItem>
		</Form>
	</Layout>
</template>
<script>
	export default {
		data() {
			return {
				cardType: {
					cardTypeId:'',
					name: '',
					amount:'',
					timeLongs: '',
					statu: 1,
				},
				status: [
					{
						value: 1,
						label: '可用',
					},
					{
						value: 0,
						label: '禁用'
					},
				],
			}
		},
		methods: {
			changeTimeLongs() {
				let str = '' + this.cardType.timeLongs;      
				if (str.indexOf('.') != -1) {        
					let arr = str.split('');
			        arr.splice(arr.length - 1);        
					let str2 = arr.join('');        
					this.cardType.timeLongs = +str2;
			      }
			    },
			changeAmount() {
				let str = '' + this.cardType.amount;
				if (str.indexOf('.') != -1) {        
					let arr = str.split('');
				    arr.splice(arr.length - 1);        
					let str2 = arr.join('');        
					this.cardType.amount = +str2;
				    }
			    },
			submit: function() {
				if(this.cardType.name != null && this.cardType.name != ""){
					if(this.cardType.timeLongs != null && this.cardType.timeLongs != "" && this.cardType.timeLongs > 0){
						if(this.cardType.amount != null && this.cardType.amount != "" && this.cardType.amount > 0){
							this.http.put({
								url: "/client/card-type/info",
								param:{
									price: this.$data.cardType.amount*100,
									cardType:this.$data.cardType,
								}
							}).then(() => {
								this.message.info("修改成功");
								this.$tabs.close();//关闭窗口
								this.$tabs.open("/cardType")//页面跳转
							});
						}else{
							this.message.error("价格不能为空且是数字");
						}
					}else{
						this.message.error("时长不能为空且是数字");
					}
				}else{
					this.message.error("会员卡名称必须输入");
				}
			},
			cancel: function() {
				this.$tabs.close();
				this.$tabs.open('/cardType')
			},
			init: function() {
				this.search();
			},
			search: function() {
				this.http.get({
					url: "/client/card-type/info",
					param: {
						cardTypeId: this.$data.cardType.cardTypeId,
					}
				}).then(data => {
					this.$data.cardType = data;	
					this.$data.cardType.amount = data.amount / 100;
					if(this.$data.cardType.statu){
						this.$data.cardType.statu = 1;
					}else{		
						this.$data.cardType.statu = 0;
					}
				});
			},
		},
		created: function() {
			this.$data.cardType.cardTypeId = this.$route.params.cardTypeId;
			this.init();
		}
		
	}
</script>

